import Vue from 'vue'
import Router from 'vue-router'

Vue.use(Router)

const Home = r => require.ensure([], () => r(require('@/pages/Home')), 'modle_1')
const Icon = r => require.ensure([], () => r(require('@/pages/Icon')), 'modle_1')
const Button = r => require.ensure([], () => r(require('@/pages/Button')), 'modle_1')
const Switch = r => require.ensure([], () => r(require('@/pages/Switch')), 'modle_1')
const Input = r => require.ensure([], () => r(require('@/pages/Input')), 'modle_1')
const Scroll = r => require.ensure([], () => r(require('@/pages/Scroll')), 'modle_1')
const Swipe = r => require.ensure([], () => r(require('@/pages/Swipe')), 'modle_1')
const Pop = r => require.ensure([], () => r(require('@/pages/Pop')), 'modle_1')
const Form = r => require.ensure([], () => r(require('@/pages/Form')), 'modle_1')
const Picker = r => require.ensure([], () => r(require('@/pages/Picker')), 'modle_1')
export default new Router({
  // mode: 'history',
  // base: process.env.BASE_URL,
  routes: [{
    path: '/',
    name: 'home',
    component: Home,
    meta: {
      rank: 1,
      title: '首页'
    }
  },
    {
      path: '/icon',
      name: 'icon',
      component: Icon,
      meta: {
        rank: 2,
        title: 'icon'
      }
    },
    {
      path: '/switch',
      name: 'switch',
      component: Switch,
      meta: {
        rank: 2,
        title: 'switch'
      }
    },
    {
      path: '/input',
      name: 'input',
      component: Input,
      meta: {
        rank: 2,
        title: 'input'
      }
    },
    {
      path: '/button',
      name: 'button',
      component: Button,
      meta: {
        rank: 2,
        title: 'button'
      }
    },
    {
      path: '/scroll',
      name: 'scroll',
      component: Scroll,
      meta: {
        rank: 2,
        title: 'scroll'
      }
    },
    {
      path: '/swipe',
      name: 'swipe',
      component: Swipe,
      meta: {
        rank: 2,
        title: 'swipe'
      }
    },
    {
      path: '/pop',
      name: 'pop',
      component: Pop,
      meta: {
        rank: 2,
        title: '弹窗'
      }
    },
    {
      path: '/form',
      name: 'form',
      component: Form,
      meta: {
        rank: 2,
        title: 'form'
      }
    },
       {
      path: '/picker',
      name: 'picker',
      component: Picker,
      meta: {
        rank: 2,
        title: 'picker'
      }
    },

  ],


})


Vue.mixin({
  beforeRouteLeave: function (to, from, next) {
    document.title = to.meta.title
    //此处判断是如果返回上一层，
    if (from && from.meta.rank && to.meta.rank && from.meta.rank > to.meta.rank) {
      if (this.$vnode && this.$vnode.data.keepAlive) {
        if (this.$vnode.parent && this.$vnode.parent.componentInstance && this.$vnode.parent.componentInstance.cache) {
          if (this.$vnode.componentOptions) {
            var key = this.$vnode.key == null ?
                this.$vnode.componentOptions.Ctor.cid + (this.$vnode.componentOptions.tag ? `::${this.$vnode.componentOptions.tag}` : '') :
                this.$vnode.key;
            var cache = this.$vnode.parent.componentInstance.cache;
            var keys = this.$vnode.parent.componentInstance.keys;
            if (cache[key]) {
              if (keys.length) {
                var index = keys.indexOf(key);
                if (index > -1) {
                  keys.splice(index, 1);
                }
              }
              delete cache[key];
            }
          }
        }
      }
      this.$destroy();
    }
    next();
  },
});
